<!-- 
利用媒体查询特性，不同屏幕尺寸下，引入的css样式不同，进而改变页面渲染
    - 应用场景：样式繁多时，针对不同媒体类型选择不同样式
    - 具体：link中判断设备尺寸，然后引入不同样式文件

    <link rel="stylesheet" media="媒体类型 关键字 (媒体特性)" href="css/不同样式.css" />

案例
    屏幕宽度<=640时，多行显示（style320.css）
    屏幕宽度>=640时，一行显示（style640.css）

还是那句话：按大到小或小到大顺序设置媒体宽度，可以很好的发挥层叠性的优点--“后来居上，覆盖”。
 -->
<link
    rel="stylesheet"
    media="screen and (max-width: 640px)"
    href="css/style320.css"
/>
<link
    rel="stylesheet"
    media="screen and (min-width: 640px)"
    href="css/style640.css"
/>

<div>1</div>
<div>2</div>
